﻿
var currentCategoryID = "";
var currentCategoryName = "";
$(document).ready(function () {
    $.ajax({
        url: "GetCaseCategoryList",
        success: function (data) {
            //        <div style="height: 161px;">
            //                    <img alt="test" class="mainImg" src="../../images/m1.png" />
            //                    <div class="mWord" style="background-color: #9d080d;">展览展馆<br />
            //                        <span style="font-size: 10px;">策划设计执行</span></div>
            //                </div>
            var content = "<img alt=\"test\" class=\"mainImg\" onclick=\"GetArticle('{4}','{5}')\" src=\"{0}\" /><div class=\"mWord\" style=\"background-color: #{3};\">{1}<br /><span style=\"font-size: 10px;\">{2}</span></div>";
            var ul = document.createElement("ul");
            $(data).each(function () {
                var temp = this;
                if (currentCategoryID == "") {
                    // 默认获取第一个分类的文章列表
                    currentCategoryID = temp.ID;
                    currentCategoryName = temp.ClassName;
                }
                var li = document.createElement("li");
                var div = document.createElement("div");
                var dd = content.replace("{0}", temp.Img).replace("{1}", temp.ClassName).replace("{2}", temp.Remark).replace("{3}", temp.Color).replace("{4}", temp.ID).replace("{5}", temp.ClassName);
                $(div).html(dd);
                $(li).html($(div).html());
                $(ul).html($(ul).html() + li.outerHTML);

            });
            $("#ItemImgHolder").html(ul.outerHTML);
            /// 加载文章列表
            if (currentCategoryID != "") {
                $("#ClassName").html(currentCategoryName);
                $.ajax({
                    url: "GetList",
                    data: { "categoryID": currentCategoryID },
                    success: function (data) {
                        var result = data;
                        var doc = document.createElement("ul");
                        var str = "<li><a href=\"PreviewArticle?id={0}\">{1}</a></li><li>";
                        $(result).each(function () {
                            var curr = this;
                            var temp = str.replace("{0}", curr.ID).replace("{1}", curr.Title);
                            $(doc).html($(doc).html() + temp);
                        });
                        // 嵌入文章列表
                        $("#list_DIV").html(doc.outerHTML);
                        $.ajax(
                        {
                            url: "GetClassPhoto",
                            data: { "categoryID": currentCategoryID },
                            success: function (data) {
                                var result = data;
                                var imgStr = "<img src=\"{0}\" style=\"width: 380px;\" alt=\"案例图片精选\"></img><br />";
                                var res = "";
                                $(result).each(function () {
                                    var temp = this;
                                    var img = imgStr.replace("{0}", temp.ImgPath);
                                    res = res + img;
                                });
                                // 嵌入案例图片
                                $("#imgHolder").html(res);
                            },
                            error: function (jqXHR) {
                                var a = jqXHR;
                            }
                        });
                    }
                }
        );


            }
        },
        error: function (jqXHR) {
            var a = jqXHR;
        }
    });

});
// 加载案例图片
function ShowClassPhoto(id) {

}

/// 点击图片重新获取文章列表
function GetArticle(id, cname) {
    currentCategoryID = id;
    currentCategoryName = cname;
    $("#list_DIV").html("");
    $("#imgHolder").html("");
    $("#ClassName").html("");
    if (currentCategoryID != "") {
        $("#ClassName").html(currentCategoryName);
        $.ajax({
            url: "GetList",
            data: { "categoryID": currentCategoryID },
            success: function (data) {
                var result = data;
                var doc = document.createElement("ul");
                var str = "<li><a href=\"PreviewArticle?id={0}\">{1}</a></li><li>";
                $(result).each(function () {
                    var curr = this;
                    var temp = str.replace("{0}", curr.ID).replace("{1}", curr.Title);
                    $(doc).html($(doc).html() + temp);
                });
                $("#list_DIV").html(doc.outerHTML);
            }
        }
        );
        $.ajax(
        {
            url: "GetClassPhoto",
            data: { "categoryID": currentCategoryID },
            success: function (data) {
                var result = data;
                var imgStr = "<img src=\"{0}\" style=\"width: 380px;\" alt=\"案例图片精选\"></img><br />";
                var res = "";
                $(result).each(function () {
                    var temp = this;
                    var img = imgStr.replace("{0}", temp.ImgPath);
                    res = res + img;
                });
                // 嵌入案例图片
                $("#imgHolder").html(res);
            },
            error: function (jqXHR) {
                var a = jqXHR;
            }
        });
    }
}